<!--积分商城的订单-->
<meta charset="utf-8"/>
<div class="row">
  <div class="col-xs-12">
    <div class="row">
      <div class="col-xs-12">
        <div style="height:36px;margin-top:2px">
          <table class="no-border" style="display:inline">
            <tr>
              <td permission='mall_order_btn_listData' style="padding-right:6px;display:none">
                订单号
              </td>
              <td permission='mall_order_btn_listData' style="display:none">
                <input type="text" id="key_out_trade_no" class="form-control search-query" placeholder="输入订单号" style="width:160px"/>
              </td>
              <td permission='mall_order_btn_listData' style="padding:0 6px;display:none" class="hidden-480">
                取货状态
              </td>
              <td permission='mall_order_btn_listData' style="display:none" class="hidden-480">
                <span class="input-group-btn" style="min-width:99px">
                  <button data-toggle="dropdown" class="btn btn-primary btn-white dropdown-toggle col-sm-12" style="margin-left:0px">
                    <span id="labelSearch_cargo_status">选择状态</span>
                    <i class="ace-icon fa fa-angle-down"></i>
                  </button>
                  <ul class="dropdown-menu col-sm-12" style="width:99px;min-width:99px">
                    <li>
                      <a href="javascript:winFn.dropdown('#key_cargo_status','','#labelSearch_cargo_status','选择状态');">选择状态</a>
                    </li>
                    <li>
                      <a href="javascript:winFn.dropdown('#key_cargo_status','1','#labelSearch_cargo_status','待取货');">待取货</a>
                    </li>
                    <li>
                      <a href="javascript:winFn.dropdown('#key_cargo_status','2','#labelSearch_cargo_status','已取货');">已取货</a>
                    </li>
                  </ul>
                  <input id="key_cargo_status" type="hidden"/>
                </span>
              </td>
              <td permission='mall_order_btn_listData' style="padding:0 6px;display:none" class="hidden-480">
                订单状态
              </td>
              <td permission='mall_order_btn_listData' style="display:none" class="hidden-480">
                <span class="input-group-btn" style="min-width:99px">
                  <button data-toggle="dropdown" class="btn btn-primary btn-white dropdown-toggle col-sm-12" style="margin-left:0px">
                    <span id="labelSearch_complete">选择状态</span>
                    <i class="ace-icon fa fa-angle-down"></i>
                  </button>
                  <ul class="dropdown-menu col-sm-12" style="width:99px;min-width:99px">
                    <li>
                      <a href="javascript:winFn.dropdown('#key_complete','','#labelSearch_complete','选择状态');">选择状态</a>
                    </li>
                    <li>
                      <a href="javascript:winFn.dropdown('#key_complete','1','#labelSearch_complete','未完成');">未完成</a>
                    </li>
                    <li>
                      <a href="javascript:winFn.dropdown('#key_complete','2','#labelSearch_complete','已发货');">已发货</a>
                    </li>
                    <li>
                      <a href="javascript:winFn.dropdown('#key_complete','3','#labelSearch_complete','已完成');">已完成</a>
                    </li>
                  </ul>
                  <input id="key_complete" type="hidden"/>
                </span>
              </td>
              <td permission='mall_order_btn_listData' style="display:none">
                <div class="input-group">
                  <span class="input-group-btn"><button type="button" class="btn btn-inverse btn-white" id="btnSearch" title="搜索查询"><span class="ace-icon fa fa-search bigger-110"></span>搜索</button></span>
                </div>
              </td>
              <td permission='mall_order_btn_listData' style="display:none" class="hidden-480">
                <div class="input-group">
                  <span class="input-group-btn"><button type="button" class="btn btn-inverse btn-white" id="btnReset" title="重置清空搜索关键字"><span class="ace-icon fa fa-undo bigger-110"></span>重置</button></span>
                </div>
              </td>
              <td permission='mall_order_btn_add' style="display:none">
                <div class="input-group">
                  <span class="input-group-btn"><button type="button" class="btn btn-inverse btn-white" id="btnAdd" title="新增|添加"><span class="ace-icon fa fa-plus bigger-110"></span>添加</button></span>
                </div>
              </td>
            </tr>
          </table>
          <div class="hidden-480 pull-right tableTools-container" permission='mall_order_btn_listData' style="display:none;margin-bottom:2px"></div>
        </div>
        <table id="tableListMallOrderInfo" class="table table-striped table-bordered table-hover">
          <tbody>
          <tr>
            <td style="text-align:center;height:37px">正在加载……</td>
          </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>
<div id="div_mall_order_logistics_edit" style="display:none;padding-top:2px">
  <form class="form-horizontal" id="form_mall_order_logistics_edit" role="form">
    <label class="col-sm-3 control-label no-padding-right"><div class="hr-4">物流公司名称<span style="color:#f00;display:inline-block;vertical-align:middle;width:auto;height:14px;line-height:18px">*</span></div></label>
    <div class="col-sm-8">
      <div class="hr-4"></div>
      <input type="text" id="distributor_name" placeholder="物流公司名称" class="form-control" maxlength="128" title="物流公司名称"/>
    </div>
    <label class="col-sm-3 control-label no-padding-right"><div class="hr-4">运单号<span style="color:#f00;display:inline-block;vertical-align:middle;width:auto;height:14px;line-height:18px">*</span></div></label>
    <div class="col-sm-8">
      <div class="hr-4"></div>
      <input type="text" id="waybill_id" placeholder="运单号" class="form-control" maxlength="128" title="运单号"/>
    </div>
    <label class="col-sm-3 control-label no-padding-right"><div class="hr-4">发件人姓名<span style="color:#f00;display:inline-block;vertical-align:middle;width:auto;height:14px;line-height:18px">*</span></div></label>
    <div class="col-sm-8">
      <div class="hr-4"></div>
      <input type="text" id="sender_name" placeholder="发件人姓名" class="form-control" maxlength="128" title="发件人姓名"/>
    </div>
    <label class="col-sm-3 control-label no-padding-right"><div class="hr-4">发件人手机号<span style="color:#f00;display:inline-block;vertical-align:middle;width:auto;height:14px;line-height:18px">*</span></div></label>
    <div class="col-sm-8">
      <div class="hr-4"></div>
      <input type="text" id="sender_mobile" placeholder="发件人手机号" class="form-control" maxlength="20" title="发件人手机号"/>
    </div>
    <label class="col-sm-3 control-label no-padding-right"><div class="hr-4" id="added_required_sender_province">发件人省名称<span style="display:inline-block;width:7px"></span></div></label>
    <div class="col-sm-8">
      <div class="hr-4"></div>
      <input type="text" id="sender_province" placeholder="发件人省名称" class="form-control" maxlength="64" title="发件人省名称"/>
    </div>
    <label class="col-sm-3 control-label no-padding-right"><div class="hr-4" id="added_required_sender_city">发件人市名称<span style="display:inline-block;width:7px"></span></div></label>
    <div class="col-sm-8">
      <div class="hr-4"></div>
      <input type="text" id="sender_city" placeholder="发件人市名称" class="form-control" maxlength="128" title="发件人市名称"/>
    </div>
    <label class="col-sm-3 control-label no-padding-right"><div class="hr-4" id="added_required_sender_area">发件人区县名称<span style="display:inline-block;width:7px"></span></div></label>
    <div class="col-sm-8">
      <div class="hr-4"></div>
      <input type="text" id="sender_area" placeholder="发件人区县名称" class="form-control" maxlength="128" title="发件人区县名称"/>
    </div>
    <label class="col-sm-3 control-label no-padding-right"><div class="hr-4">发件人详细地址<span style="color:#f00;display:inline-block;vertical-align:middle;width:auto;height:14px;line-height:18px">*</span></div></label>
    <div class="col-sm-8" style="margin-bottom:6px">
      <div class="hr-4"></div>
      <input type="text" id="sender_address" placeholder="发件人详细地址" class="form-control" maxlength="128" title="发件人详细地址"/>
    </div>
  </form>
</div>
<div id="divKeyColumns" style="display:none;padding:1px 0px;"></div>
<div style="display:none;">
  <input type="hidden" id="mall_order_btn_listData"/>
  <input type="hidden" id="mall_order_btn_add"/>
  <input type="hidden" id="mall_order_row_edit"/>
  <input type="hidden" id="mall_order_row_queryById"/>
</div>
<script type="text/javascript">
  ;(function($){
    var tableDom = '#tableListMallOrderInfo';
    var urlRoute = '/mallOrderInfo/';/*请求controller层的url*/
    var getList = urlRoute + 'listData';/*获取数据列表*/
    var urlEdit = urlRoute + 'edit';/*编辑*/
    var urlQueryById = urlRoute + 'queryById';/*根据id查询对应的数据*/
    var stateOriginal = {};//仅供参考，更新优化-选项1,可参考项目law-frontend的页面serviceAd.html和后端law-backend的ServiceADService.java;记录编辑的值,仅在编辑时可用
    var thisTable = null;
    var width = winFn.fnGetWidth();
    thisPage = {
      init : function(){
        this.initTable();
        this.initDom();
        this.addEvent();
      },
      initDom : function(){},
      addEvent : function(){
        //搜索按钮
        $('#btnSearch').on('click', function(){
          thisPage.search(true);
        });
        //重置按钮
        $('#btnReset').on('click', function(){
          $('#key_out_trade_no').val('');
          $('#labelSearch_cargo_status').text('选择状态');
          $('#key_cargo_status').val('');
          $('#labelSearch_complete').text('选择状态');
          $('#key_complete').val('');
        });
        //按钮组-自定义显示列
        $('#iconColumn').parent().parent().on('click', function(){
          pageDataTable.columnCustom(thisTable, tableDom,'#divKeyColumns');
        });
        //按钮组-搜索
        $('#iconRefresh').parent().parent().on('click', function(){
          thisPage.search(true);
        });
      },
      initTable : function(){
        var optsVisible = getOptsVisible('mall_order_row');//确定是否要显示操作选项,若是多个按钮权限时以逗号,隔开
        var optsBatchBtn = getOptsVisible('mall_order_btn_delByKeys');//是否有批量操作的权限,若是多个按钮权限时以逗号,隔开
        var aoColumns = [];
        if(optsBatchBtn){
          aoColumns.push({
            sortable : false,
            data : "kid",
            width : "38px",
            class : "center",
            visible : true,
            title : '<label title="全选|不选"><input type="checkbox" class="ace" /><span class="lbl"></span></label>'
          });
        }
        aoColumns.push({
          data : "user_name",
          sortable : false,
          title : "下单人账号",
          class : 'text-center',
          width : "90px"
        });
        aoColumns.push({
          data : "out_trade_no",
          sortable : false,
          title : "订单号",
          class : 'text-center',
          width : "140px"
        });
        aoColumns.push({
          data : "type",
          sortable : false,
          title : "订单类型",
          className : 'hidden-480 text-center',
          width : "70px",
          render : function(value,type,row,meta){
            switch (value){
              case 1:
                return "微信支付";
              case 2:
                return "积分支付";
              default:
                return "";
            }
          }
        });
        aoColumns.push({
          data : "total_fee",
          sortable : false,
          title : "金额积分",
          className : 'text-center',
          width : "64px"
        });
        aoColumns.push({
          data : "status",
          sortable : false,
          title : "订单状态",
          width : "64px",
          className : 'hidden-480 text-center',
          render : function(value,type,row,meta){
            switch (value){
              case 0:
                return "未支付";
              case 1:
                return "已付款";
              default:
                return "";
            }
          }
        });
        aoColumns.push({
          data : "cargo_status",
          sortable : false,
          title : "取货状态",
          width : "64px",
          className : 'hidden-480 text-center',
          render : function(value,type,row,meta){
            switch (value){
              case 1:
                return "待取货";
              case 2:
                return "已取货";
              default:
                return "";
            }
          }
        });
        aoColumns.push({
          data : "complete",
          sortable : false,
          title : "物流状态",
          width : "64px",
          className : 'hidden-480 text-center',
          render : function(value,type,row,meta){
            if(row.cargo_status == 2){
              return "已完成";
            }else{
              switch (value){
                case 1:
                  return "未完成";
                case 2:
                  return "已发货";
                case 3:
                  return "已完成";
                default:
                  return "";
              }
            }
          }
        });
        aoColumns.push({
          data : "add_date",
          sortable : false,
          title : "下单时间",
          width: "121px",
          className : 'text-center',
          render : function(value){
            if(value){
              return winFn.formatDate(value,true);
            }else{
              return "";
            }
          }
        });
        aoColumns.push({
          data : "transaction_id",
          sortable : false,
          title : "微信订单号",
          className : 'hidden-480',
          width : "216px",
          render : function(value,type,row,meta){
            value = value || '';
            return value;
          }
        });
        aoColumns.push({
          data : "real_name",
          sortable : false,
          title : "收货人"
        });
        aoColumns.push({
          data : "phone",
          sortable : false,
          title : "联系电话"
        });
        var _maxWidth = 255;
        if(width <= 1366){
          _maxWidth = 200;
        }
        aoColumns.push({
          data : "address",
          sortable : false,
          width : _maxWidth+'px',
          title : "收货地址",
          render : function(value,type,row,meta){
            var address = row.province_name + row.city_name + row.county_name + value;
            if(value){
              return '<div style="width:'+_maxWidth+'px;max-width:'+_maxWidth+'px;overflow:hidden;text-overflow:ellipsis;" title="'+address+'">'+address+'</div>';
            }else{
              return '';
            }
          }
        });
        if(optsVisible){
          aoColumns.push({
            data : "_kid_",
            width : "40px",
            class : 'text-center',
            title : "<label style='color:#000' title='单行操作'>选项</label>",
            sortable : false
          });
        }
        var columnDefs = [];
        if(optsBatchBtn){
          columnDefs.push({
            targets : 0,
            render : function(value,type,row,meta){
              return '<label title="选择|取消"><input type="checkbox" name="kid" value="'+ value +'" style="cursor:pointer;text-decoration:none;outline:none;"/><span class="lbl"></span></label>';
            }
          });
        }
        if(optsVisible){//是否来显示某列
          columnDefs.push({
            targets : -1,
            render : function(value,type,row,meta){
              return "<a title='发货' href='javascript:thisPage.rowEdit("+ meta.row +");' style='outline:none;text-decoration:none;color:#3b8cff;display:none' permission='mall_order_row_edit'>发货</a>";
            }
          });
        }
        var columnTarget = [];
        for(var o=0;o<aoColumns.length;o++){
          columnTarget.push(o);
        }
        columnDefs.push({
          targets : optsBatchBtn ? columnTarget.slice(1) : columnTarget,
          render : function(value,type,row,meta){
            return pageDataTable.formatColumn(value);
          }
        });
        columnDefs.push({
          visible : false,//列的隐藏显示
          targets : []//指定列索引
        });
        thisTable = pageDataTable.initDataTable({
          tableDom : tableDom,
          sAjaxSource : getList,
          fnServerParams : function(params){
            params.push(
              {"name":"out_trade_no","value":winFn.getDomValue('#key_out_trade_no')},
              {"name":"cargo_status","value":winFn.getDomValue('#key_cargo_status')},
              {"name":"complete","value":winFn.getDomValue('#key_complete')}
            );
          },
          aoColumns : aoColumns,
          columnDefs : columnDefs,
          complete : function(settings,data){},//仅执行一次
          footer : function(data,start,end,thLength){},//每次都会执行
          selected : function(selected){
            if(selected){
              //$('#btnDel').removeAttr('disabled');//默认在该button添加属性disabled="disabled"
            }else{
              //$('#btnDel').attr('disabled','disabled');
            }
          }
        });
        pageDataTable.buttons(thisTable);
        pageDataTable.action(thisTable);
        pageDataTable.select(thisTable, tableDom);
        pageDataTable.tooltip();
        $('.dataTables_scroll .dataTables_scrollBody').removeAttr('style');//解决dataTable表头下拉框被tbody遮挡
      },
      //是否是搜索,是则搜索时则返回到第一页
      search : function(search){
        if(verifyFn.inputCheck('#mall_order_btn_listData','没有操作权限')) return;
        $(tableDom + '_wrapper table input[type=checkbox]').prop('checked',false);//此行不需要,因为搜索时表格已重新渲染
        //thisTable.draw();保留
        if(search){
          $(tableDom).DataTable().ajax.reload();//编辑时成功会重载所有接口数据，返回到第一页
        }else{
          $(tableDom).DataTable().ajax.reload(null,false);//编辑时成功重新加载表数据(分页页码保留);
        }
      },
      //需要时或为空时才去请求,减轻服务器查询,仅适用于不需要分页的数据,用法:thisPage.getMall_order_infos(function(list){});参考项目 wine-frontend/src/main/resources/static/activity.html的getGoods方法
      getMall_order_infos : function(callback){
        if(listMall_order_info == null){//定义全局的 var listMall_order_info = null;//新增或编辑时所需的数据
          layerFn.queryGetHintResult(urlQueryMall_order_info,{},function(data){
            if(AppKey.code.code200 == data.code){
              listMall_order_info = data.data;
              callback(listMall_order_info);
            }else{
              callback();//注意判断 if(listMall_order_info != null){}为空,可参考 liquor-console/src/main/resources/static/goods.html
            }
          });
        }else{
          callback(listMall_order_info);
        }
      },
      resetForm : function(){
        winFn.clearFormData('#form_mall_order_logistics_edit');
      },
      //移除不需要对比的key(此方法可有可无)
      editJson : function(data,keys){
        if(keys){
          for(var h = 0; h < keys.length; h++){
            delete data[keys[h]];//删除key元素
          }
        }
        stateOriginal = data;
      },
      //对比是否已修改了值,仅需判断必填的字段，文件上传的字段单独处理
      filterValue : function(params){
        if(stateOriginal != null){
          var ignoreKeys = '';
          var requiredKeys = '';
          for(var so in stateOriginal){
            if(params[so] == stateOriginal[so]){
              delete params[so];
              if(ignoreKeys != ''){
                ignoreKeys += ','+so;
              }else{
                ignoreKeys += so;
              }
            }else{
              if(requiredKeys != ''){
                requiredKeys += ','+so;
              }else{
                requiredKeys += so;
              }
            }
          }
          if(ignoreKeys != ''){
            params['ignoreKeys'] = ignoreKeys;//记录后端忽略验证的key以,隔开的字符串,注意数据库字段是否允许为空,可参考项目law-backend的joins.html;law-backend的JoinsService的方法edit();
          }
          if(requiredKeys != ''){
            params['requiredKeys'] = requiredKeys;//记录后端必填验证的key以,隔开的字符串
          }
        }
      },
      rowEdit : function(rowIndex){
        var row = thisTable.row(rowIndex).data();
        if(row.complete == 2){
          layerFn.queryByIdHint(urlQueryById,row.out_trade_no,function(data){
            thisPage.openDialog(row.out_trade_no,2,data.data);//编辑
          });
        }else{
          thisPage.openDialog(row.out_trade_no,1,row);//新增
        }
      },
      openDialog : function(out_trade_no,target,map){
        layerFn.addOrEdit('订单号['+out_trade_no+']发货信息','#div_mall_order_logistics_edit', ['500px','398px'], function(layerIndex,layero){
          if(verifyFn.inputNull('#distributor_name','物流公司名称不能为空')) return;
          if(verifyFn.inputNull('#waybill_id','运单号不能为空')) return;
          if(verifyFn.inputNull('#sender_name','发件人姓名不能为空')) return;
          if(verifyFn.inputNull('#sender_mobile','发件人手机号不能为空')) return;
          if(verifyFn.inputNull('#sender_address','发件人详细地址不能为空')) return;
          var params = {
            distributor_name : winFn.getDomValue('#distributor_name',true),
            waybill_id : winFn.getDomValue('#waybill_id',true),
            sender_name : winFn.getDomValue('#sender_name',true),
            sender_mobile : winFn.getDomValue('#sender_mobile',true),
            sender_province : winFn.getDomValue('#sender_province',true),
            sender_city : winFn.getDomValue('#sender_city',true),
            sender_area : winFn.getDomValue('#sender_area',true),
            sender_address : winFn.getDomValue('#sender_address',true),
            out_trade_no : out_trade_no,
            user_id : map.user_id,
            openid : map.openid,
            target : target,
            type : map.type,
            transactionId : map.transaction_id
          };
          layerFn.submit(urlEdit,params,function(data){
            thisPage.complete(data,layerIndex,true);
          });
        });
        thisPage.resetForm();
        if(map != null){
          $.each(map,function(k,v){
            try{
              $('#' + k).val(v);//若是有问题则把这个放在最前面
            }catch(e){}
          });
        }
      },
      //查看隐藏部分是全部内容,用法 render : function(value,type,row,meta){return thisPage.rowColumnView(value);}
      rowColumnView : function(value){
        if(value == null || value == undefined || value == '') return '';
        value = typeof value === 'string' ? value.replace(/</g, '&lt;').replace(/"/g, '&quot;') : value;//如果提示SyntaxError: expected expression, got '>'错误则注释掉即可
        var len = value.length;
        if(len > 30){
          return "<a href='javascript:layerFn.viewValue(\""+value+"\",\"430px\");' title='点击查看详情' style='outline:none;text-decoration:none;'>"+value.substring(0,30)+"…</a>";
        }else{
          return value;
        }
      },
      complete : function(data,index,search){
        try{
          if(index){
            layerFn.closeIndex(index);
          }
          if(search){
            thisPage.search();
          }
          if(data){
            layerFn.handleResult(data.msg,data.code);
          }
        }catch(e){}
      }
    };
    thisPage.init();
    $('script').remove();
  })(jQuery);
</script>